<template>
  <view class="mycard" @click="() => $emit('handleView')">
    <view class="card-left">
      <view class="card-title">
        <text class="title">{{ cardData.title }}</text>
      </view>
      <view class="card-info">
        <text class="title">{{ cardData.info }}</text>
      </view>
      <view class="card-view" v-if="cardData.title === '自己的日报'">
        <text class="title"
          >本月已发送<text
            style="
              font-size: 36rpx;
              margin: 0px 4rpx;
              line-height: 36rpx;
              font-weight: bold;
              color: #333333;
            "
            >{{ cardData.count }}</text
          >
          份</text
        >
      </view>
      <view class="card-view" v-if="cardData.title === '其他人的日报'">
        <text class="title"
          >看查看日报<text
            style="
              font-size: 36rpx;
              margin: 0px 4rpx;
              line-height: 36rpx;
              font-weight: bold;
              color: #333333;
            "
            >{{ cardData.count }}</text
          >
          人</text
        >
      </view>
    </view>
    <view class="card-right">
      <image
        style="width: 144rpx; height: 172rpx; margin-top: 18rpx"
        src="../../static/images/daily_view.png"
      ></image>
      <image
        style="
          width: 56rpx;
          height: 56rpx;
          position: absolute;
          bottom: 0;
          right: 26rpx;
        "
        src="../../static/images/yuanbiao.png"
      ></image>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    cardData: {
      type: Object,
      default: {
        title: '',
        info: '',
        count: 0,
        height: '192rpx',
      },
    },
  },
  data() {
    return {
      title: 'Hello',
    }
  },
  onLoad() {},
  methods: {
    handleJump() {
      uni.navigateTo({
        url: '/pages/leader-daily/daily-view-detail/index',
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.mycard {
  display: flex;
  justify-content: space-between;
  height: 190rpx;
  margin: 30rpx;
  background: #fff1f1;
  border-radius: 10rpx;
  box-shadow: 0px 3rpx 6rpx 0px #b29494;
  box-sizing: border-box;
}
.mycard .card-left {
  padding-left: 30rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.card-info .title {
  margin: 8rpx 0rpx;
  display: block;
  height: 24rpx;
  font-size: 22rpx;
  font-weight: bold;
  color: #666666;
  line-height: 30rpx;
}
.mycard .card-right {
  position: relative;
  width: 144rpx;
  height: 172rpx;
}
.card-title .title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333333;
  line-height: 30rpx;
}
.card-view .title {
  height: 22rpx;
  font-size: 22rpx;
  color: #606c81;
  line-height: 30rpx;
}
</style>
